<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %> 
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org"
      xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity3"
      xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout">
<head lang="zh-CN">
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1"/>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, process-scalable=no"/>
    <title>任务列表</title>
    <!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
 <link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" rel="stylesheet"/>
 <link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
 <link href="/lib/layer/theme/default/layer.css" rel="stylesheet"/>
 
 <script src="https://cdn.bootcss.com/jquery/3.2.0/jquery.min.js"></script>
 <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
 <script src="/lib/layer/layer.js"></script>
 <script src="/js/common.js"></script>
 <style>
 	table{
 		border:1px solid #000
 	}
 	table th{
 		border:1px solid #000;
 		background:gray;
 		color:white;
 	}
 	table td{
 		border:1px solid #000
 	}
 </style>
</head>
<body>
<div class="container">
	<form id="formList" action="" method="post">
		<div class="form-group">
    		<label for="resourcePath">执行人名称</label>
    		<select class="form-control" id="userId">
    			<option>--请选择--</option>
    		</select>
    		<label for="resourcePath">执行身份</label>
    		<select class="form-control" id="roleName">
    			<option>--请选择--</option>
    		</select>
    		<input type="hidden" id="type" class="form-control" name="type" />
  		</div>
	</form>
	<button class="btn btn-default" id="check" type="submit" onclick="checkList()">提交</button>
	<hr/>
	<div class="bs-callout bs-callout-info" id="callout-type-b-i-elems">
    <h4>任务列表</h4>
    <p>可选择执行人名称或执行身份（用户组），点击提交查询对应任务，两者互斥</p>
  </div>
  	<div id="tabletarget">
  	
  	</div>
		
	

</div>
<script type="text/javascript">
$(document).ready(function(){
		$.ajax({
            url:"/user/getdrop",
            type:"post",
            contentType:'application/json',
            success:function(result){
                if(result.status==0){
                	var op = '';
                	$.each(result.list, function (i, group) { 
                		op+='<option value="'+result.list[i].userId+'">'+result.list[i].userName+'</option>';
                    });
					$("#userId").append(op);
                }else{
                	layer.msg("技术不行啊");
                }
            },
            error:function(e){
                alert("错误！！");
            }
        });   
		$.ajax({
            url:"/groups/getList",
            type:"post",
            contentType:'application/json',
            success:function(result){
                if(result.status==0){
                	var op = '';
                	$.each(result.list, function (i, group) { 
                		op+='<option value="'+result.list[i].name+'">'+result.list[i].name+'</option>';
                    });
					$("#roleName").append(op);
                }else{
                	layer.msg("技术不行啊");
                }
            },
            error:function(e){
                alert("错误！！");
            }
        });   
		
})
	function checkList(){
		$.ajax({
            url:"/process/getList",
            type:"post",
            data:$('#formList').serialize(),
            success:function(list){
            	$("#tabletarget").empty();
            	var op='<table id="tablelist" class="table table-bordered"><tr><th>实例id</th><th>标题</th><th>申请日期</th></tr>';
            	$.each(list, function (i, task) { 
            		op+='<tr><td>'+list[i].taskId+'</td><td>'+list[i].taskName+'</td><td>'+list[i].taskDefinitionKey+'</td></tr>'
            	});
            	op+='</table >';
            	console.log(op);
            	$("#tabletarget").append(op);
            },
            error:function(e){
                alert("错误！！");
                window.clearInterval(timer);
            }
        });        
	}
	$("#userId").change(function(){
		$("#type").val("0");
		$("#userId").attr("name","args");
		$("#roleName").get(0).selectedIndex=0;
		$("#roleName").removeAttr("name");
	})
	$("#roleName").change(function(){
		$("#type").val("1");
		$("#roleName").attr("name","args");
		$("#userId").get(0).selectedIndex=0; 
		$("#userId").removeAttr("name");
	})
</script>
</body>
</html>